import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:kxy_flutter_app/model/user_basic.dart';
import 'package:kxy_flutter_app/view/home/notice/notice_view.dart';
import 'package:kxy_flutter_app/view/my/basic_info/user_info_editor_view.dart';
import 'package:kxy_flutter_app/view/my/exam_history/exam_history_view.dart';
import 'package:kxy_flutter_app/view/root/view_model/app_info_model.dart';
import 'package:kxy_flutter_app/view/root/view_model/navigation_model.dart';
import 'package:line_awesome_icons/line_awesome_icons.dart';
import 'package:provider/provider.dart';
import '../../r.dart';
import 'collect/collect_view.dart';
import 'mistake/mistake_list_view.dart';

class HeadWidget extends StatelessWidget {
  final UserBasic user;
  HeadWidget({@required this.user});

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.fromLTRB(15, 20, 15, 15),
      child: Column(
        children: [
          title(context),
          Container(
            padding: EdgeInsets.symmetric(vertical: 20),
            margin: EdgeInsets.only(top: 20),
            decoration: BoxDecoration(
              color: Color.fromRGBO(255, 255, 255, 0.9),
              borderRadius: BorderRadius.circular(10),
              boxShadow: [
                BoxShadow(
                  color: Color.fromRGBO(0, 0, 0, 0.07),
                  blurRadius: 1,
                ),
              ],
            ),
            child: Column(
              children: [
                userInfo(user, context),
                myActioins(context),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Widget title(BuildContext context) {
    var title = Consumer<AppInfoModel>(
      builder: (cxt, vm, child) {
        return Text(
          vm.centerTitle,
          style: TextStyle(
            fontSize: 24,
            color: Colors.white,
            fontWeight: FontWeight.bold,
          ),
        );
      },
    );

    var icon = GestureDetector(
      child: Stack(
        children: [
          Padding(
            padding: EdgeInsets.all(3),
            child: Image.asset(R.assetsMyNotice, height: 20),
          ),
          Positioned(
            right: 0,
            top: 0,
            child: noticeDot(),
          ),
        ],
      ),
      onTap: () {
        Navigator.push(
          context,
          MaterialPageRoute(
            builder: (cxt) => NoticeView(),
          ),
        );
      },
    );

    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [title, icon],
    );
  }

  Widget noticeDot() {
    return Consumer<NavigationModel>(builder: (cxt, vm, child) {
      return Container(
        height: 6,
        width: 6,
        decoration: BoxDecoration(
          color: vm.noticeCount > 0 ? Color.fromRGBO(255, 74, 82, 1) : Colors.transparent,
          shape: BoxShape.circle,
        ),
      );
    });
  }

  Widget userInfo(UserBasic user, BuildContext context) {
    var icon = Padding(
      padding: EdgeInsets.only(left: 20),
      child: ClipRRect(
        borderRadius: BorderRadius.circular(50),
        child: CachedNetworkImage(
          imageUrl: user.headUrl,
          height: 60,
          width: 60,
          errorWidget: (_, __, ___) => Image.asset(
            R.assetsImgLogo,
            height: 60,
          ),
        ),
      ),
    );

    var titleStyle = TextStyle(
      fontSize: 18,
      fontWeight: FontWeight.bold,
      color: Color.fromRGBO(34, 34, 34, 1),
    );

    var subTitleStyle = TextStyle(
      fontSize: 13,
      color: Colors.black38,
    );

    var subtitle = Wrap(
      children: [
        Text(
          user.deptName,
          style: subTitleStyle,
        ),
        if (user.jobNumber != null && user.jobNumber.isNotEmpty)
          Padding(
            padding: EdgeInsets.symmetric(horizontal: 5),
            child: Text('|', style: subTitleStyle),
          ),
        if (user.jobNumber != null && user.jobNumber.isNotEmpty)
          Text(
            '编号${user.jobNumber}',
            style: subTitleStyle,
          ),
      ],
    );

    var editor = InkWell(
      child: Container(
        padding: EdgeInsets.symmetric(horizontal: 15, vertical: 10),
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.horizontal(
              left: Radius.circular(20),
            ),
            boxShadow: [
              BoxShadow(
                color: Color.fromRGBO(0, 0, 0, 0.07),
                blurRadius: 1,
              ),
            ]),
        child: Icon(LineAwesomeIcons.pencil, size: 18),
      ),
      onTap: () {
        Navigator.push(
            context,
            MaterialPageRoute(
              builder: (cxt) => UserInfoEditorView(),
            ));
      },
    );

    var info = ListTile(
      contentPadding: EdgeInsets.fromLTRB(10, 0, 0, 0),
      title: Text(user.realName, style: titleStyle),
      subtitle: Padding(
        padding: EdgeInsets.only(top: 5),
        child: subtitle,
      ),
      trailing: editor,
    );

    return Container(
      child: Row(
        children: [
          icon,
          Expanded(child: info),
        ],
      ),
    );
  }

  Widget myActioins(BuildContext context) {
    return Container(
      padding: EdgeInsets.fromLTRB(20, 30, 20, 10),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          actionItem(
            R.assetsMyExamHistory,
            '考试记录',
            new ExamHistoryView(),
            context,
          ),
          actionItem(
            R.assetsMyQuesError,
            '我的错题',
            new MistakeListView(),
            context,
          ),
          actionItem(
            R.assetsMyCollect,
            '我的收藏',
            new CollectView(),
            context,
          ),
          actionItem(
            R.assetsMyCourse,
            '我的课程',
            null,
            context,
            onTap: () {
              var navModel = Provider.of<NavigationModel>(context, listen: false);
              navModel.changeSelectIndex(3);
            },
          ),
        ],
      ),
    );
  }

  Widget actionItem(String imgName, String text, Widget target, BuildContext context, {Function onTap}) {
    return InkWell(
      onTap: () {
        if (onTap != null) {
          onTap();
        } else {
          Navigator.push(
            context,
            MaterialPageRoute(builder: (cxt) => target),
          );
        }
      },
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: [
          Padding(
            padding: EdgeInsets.only(bottom: 10),
            child: Image.asset(imgName, height: 26),
          ),
          Text(
            text,
            style: TextStyle(
              fontSize: 12,
              color: Color.fromRGBO(147, 149, 153, 1),
            ),
          ),
        ],
      ),
    );
  }
}
